import '@/styles/global.scss';
import 'animate.css';

import { Layout } from 'antd';
import { useLocation } from 'react-router-dom';

import AuthRoute from '@/components/AuthRoutes';
import GlobalHeader from '@/components/GlobalHeader';
import routes from '@/routes';

const { Content } = Layout;

const App: React.FC = () => {
  const location = useLocation();

  if (['/auth', '/404'].includes(location.pathname)) {
    return <AuthRoute routes={routes} />;
  } else {
    return (
      <Layout className="overflow-hidden">
        <GlobalHeader />
        <Content className="h-content flex justify-center bg-content overflow-scroll global-background">
          <div className="h-full w-react text-content">
            <AuthRoute routes={routes} />
          </div>
        </Content>
      </Layout>
    );
  }
};

export default App;
